<template>
  <div class="final-found-item">
    <found-item-view
      :dataArr="dataArr"
      :topTagLists="topTagLists"
      :advertisingData="advertisingData"
      :getNewData="getNewData"
      :getData="getData"
      :switchSelected="switchSelected"
    />
  </div>
</template>

<script>
import { get_recommended_data, get_advertising } from "@/apis/http";
import FoundItemView from "@/components/HomeComponents/FoundComponents/FoundItemView.vue";

export default {
  name: "FinalFoundItem", //最终完美的组件
  props: ["domainId"],
  data() {
    return {
      dataArr: [],
      topTagLists: [],
      advertisingData: []
    };
  },
  components: { FoundItemView },
  mounted() {
    this.getNewData();
    this.getAdvertising();
  },
  methods: {
    //第二步  在自定义方法中调用get_users方法，通过async和awit搭配直接获取到数据
    async getNewData() {
      //通过路由传参的形式，请求数据！！！ {data:res}直接结构赋值出来data给res
      let { data: res } = await get_recommended_data({
        domainId: this.domainId
      });
      //   console.log(res); // 这样就获取到了请求的所有数据！
      this.dataArr = res.list;
      this.topTagLists = res.topTagLists;
      console.log(this.dataArr);
      this.showLoading = false;
      //后续就可以通过赋值的方式，在页面上渲染数据。
    },

    async getData() {
      //通过路由传参的形式，请求数据！！！ {data:res}直接结构赋值出来data给res
      let { data: res } = await get_recommended_data({
        domainId: this.domainId 
      });
      //   console.log(res); // 这样就获取到了请求的所有数据！
      this.dataArr.push(...res.list);
      //后续就可以通过赋值的方式，在页面上渲染数据。
    },

    async getAdvertising() {
      //通过路由传参的形式，请求数据！！！ {data:res}直接结构赋值出来data给res
      let data = await get_advertising({
          category: "EXPLOREBANNER",
          extJson: `{"domainId":${this.domainId}}`
      });
      //   console.log(data); // 这样就获取到了请求的所有数据！
      this.advertisingData = data[0].ads;
      //后续就可以通过赋值的方式，在页面上渲染数据。
    },

    onRefresh() {
      setTimeout(() => {
        this.$nextTick(() => {
          this.isLoading = false;
          this.getNewData();
        });
      }, 1000);
    },

    loadmore() {
      this.loading = true;

      if (this.time) {
        setTimeout(() => {
          this.getData();
          this.loading = false;
          // 模拟请求，请求3次，3次结束后设置加载结束
          this.time--;
        }, 1000);
      } else {
        this.$refs.loadmore.loadEnd();
      }
    },

    switchSelected(id) {
      this.$nextTick(() => {
        this.dataArr.forEach(r => {
          if (r.itemId === id) {
            if (r.postData.postCount.viewCount == 1) {
              r.postData.postCount.viewCount = 0;
              r.postData.postCount.favoriteCount -= 1;
            } else {
              r.postData.postCount.viewCount = 1;
              r.postData.postCount.favoriteCount += 1;
            }
          }
        });

        this.$store.commit("toggleMyLike", id);
        console.log(this.$store.state.myLike);
      });
    }
  }
};
</script>

<style lang="scss" scoped>
</style>